<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>appointment registration</title>
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/public.css">
    <link rel="stylesheet" href="font-awesome-4.7.0/css/font-awesome.min.css">
    <style>
       body{
            background: rgb(248,248,248);
       }
       main{
           width:100%;
           height:864px;
       }
       .main_body{
           width:62.5%;
           height:776px;
           margin: 0px auto;
       }
       .main_body_left{
           margin-top:36px;
           width:24%;  /*288px*/
           float: left;
       }
       .main_body_left_top{
           width:100%;
           height: 114px;
           background: #ffffff;
           box-shadow: -3px 3px 3px #dadada;
           padding-top:25px;
       }
       .main_body_left_top h4{
           margin-left:20px;
           /* margin-top:25px; */
           font-size:24px;
           color:#57c7f6;
       }
       .main_body_left_top p{
            margin-left:20px;
            margin-top:9px;
            font:12px/19px 'simhei';
            width:87%;
            color: #b9b9b9;
       }
       .main_body_left_center{
           width:100%;
           height: 177px;
           background: #ffffff;
           box-shadow: -3px 3px 3px #dadada;
           margin-top: 1px;
           padding-top:20px;
       }
       .main_body_left_center .bgTopLeft{
           width:40px;
           height:40px;
           background: url("img/search.gif") 100% 100% no-repeat;
           float: left;
           margin-left:6.9%;
           
       }
       .main_body_left_center .bgTopRight p{
            font-size:15px;
            color:#9878ff;
       }
       .main_body_left_center .bgTopRight{
           width:62.5%;
           height:40px;
           float: left;
           font-size:11px;
           color:#a3a3a3;
           margin-left: 1%;
       }
       .main_body_left_center .botLi{
           margin-top:32px;
       }
       .main_body_left_center .bgBotLeft{
            background: url("img/dbman.gif") 100% 100% no-repeat;
       }
       .main_body_left_center .bgBotRight p{
           color:#6686ff;
       }
       .main_body_left_bottom{
           width:100%;
           height:356px;
           background: #ffffff;
           box-shadow: -3px 3px 3px #dadada;
           margin-top:20px;
       }
       .main_body_left_bottom p:nth-of-type(1){
           color:#333333;
           font-weight: bolder;
           font-size:19px;
           padding-top:15px;
           width:100%;
           height:19px ;
           text-align: center;
       }
       .main_body_left_bottom p:nth-of-type(2), .main_body_left_bottom p:nth-of-type(3){
           color:#333333;
           font-size:11px;
           margin-top:9px;
           width:100%;
           text-align: center;
           
       }
       .main_body_left_bottom h4:nth-of-type(1), .main_body_left_bottom h4:nth-of-type(2){
           width:88px;
           height:88px;
           background: url("img/code.png") 100% 100% no-repeat;
           margin:18px auto 0px;
       }
       .main_body_left_bottom p:nth-of-type(4), .main_body_left_bottom p:nth-of-type(5){
            color:#c4c4c4;
           font-size:11px;
           margin-top:7px;
           width:100%;
           text-align: center;
       }

       .main_content{
           height:730px;
       }
       .main_content iframe{
           width:100%;
           height:100%;
           border:none;
       }
    </style>
</head>
<body>
    <header class="header">
        <div class="header_up">
            <h2>YOUR LOGO</h2>
            <label class="header_up_lab"><span class="fa fa-search"></span><input type="text" placeholder="请输入科室名/医生名/疾病名" class="text" ></label>
            <input type="text" value="搜索" class="search">
            <p class="adm"><a href=""> <span class="fa fa-user"></span>&nbsp; / 管理员登录</a></p>
        </div>
    </header>
    <nav>
        <div class="nav_a">
            <a href="首页.html" >首页</a>
            <a href="appointment.html" class="active">预约挂号</a>
            <a href="Onlinevisit.html">在线问诊</a>
            <a href="./personal/index.html">个人中心</a>
            <a href="healthinquiry.html">健康咨询</a>
            <a href="illnessinquiry.html">疾病专题</a>
        </div>
    </nav>
    <main class="main">
        <div class="main_top">
            <span>当前位置：首页 > </span>
            <strong>预约挂号</strong>
        </div>
        <div class="main_body_left clear">
            <div class="main_body_left_top">
                <h4>预约挂号</h4>
                <p>帮助普通患者快速找到选定条件下可预约的专家(目前只支持部分医院)</p>
            </div>
            <div class="main_body_left_center">
                <ul>
                    <li class="clear">
                        <div class="bgTopLeft"></div>
                        <div class="bgTopRight">
                            <p>快速筛选</p>
                            <div>根据区域、医院快速筛选对应班次</div>
                        </div>
                    </li>
                    <li class="clear botLi">
                        <div class="bgTopLeft bgBotLeft"></div>
                        <div class="bgTopRight bgBotRight">
                            <p>快速筛选</p>
                            <div>根据区域、医院快速筛选对应班次</div>
                        </div>
                    </li>
                </ul>
            </div>
            <div class="main_body_left_bottom">
                <p>手机挂号10秒搞定！</p>
                <p>立即扫描下载微医APP或</p>
                <p>关注微信公众号,让看病变得更简单！</p>
                <h4></h4>
                <p>扫码下载手机APP</p>
                <h4></h4>
                <p>扫码关注微信公众号</p>
            </div>
        </div>
        <div class="main_content" id="main_content">
            <iframe src="./appintmentApp.html" id="iFr"></iframe>
        </div>
    </main>
    <footer>
        <div class="footer_up">
            <div class="footer_up_con">
               <div class="footer_up_con_fir">
                   <p class="footer_up_con_fir1">
                       <a href="">联系我们</a>
                       <span>Content us</span>
                   </p>
                   <p class="footer_up_con_fir2">关注</p>
                   <p class="footer_up_con_fir3">您身边的家庭医生</p>
               </div>
               <div class="footer_up_con_two">
                    <div class="footer_up_con_two_img">
                        <span><img src="img/weibo.png" alt=""></span>
                        <span><img src="img/weixin.png" alt=""></span>
                        <span><img src="img/qq.png" alt=""></span>
                    </div>
                    <div class="footer_up_con_two_adress">
                        <p>地址: 北京市朝阳区国贸写字楼B座</p>
                        <p>电话: 400612358</p>
                        <p>邮箱: infor@abgj.com</p>
                    </div>
                    <div class="footer_up_con_two_phone">
                       <p>邮编: 400160</p>
                       <p>手机: 138466066</p>
                    </div>
               </div>
              
        </div>
       </div>
       <div class="footer_end">
            <p>京公网安备11010125610012号京ICP证150277号京ICP备15002532号</p>
        </div>
       </footer>
</body>
</html>